<template>
  <div>
    <a-modal
      title="新增"
      :visible="visible"
      :confirm-loading="loading"
      ok-text="保存"
      :width="900"
      @ok="ok"
      @cancel="cancel"
    >
      <div class="about-master-container">
        <!-- 表格 -->
        <s-table
          ref="tableModalList"
          tableLayout="fixed"
          size="default"
          rowKey="id"
          :row-selection="rowSelection"
          :columns="columns"
          :data="loadData"
          :alert="true"
          show-size-changer
          show-quick-jumper
          :showPagination="false"
        ></s-table>
      </div>
    </a-modal>
  </div>
</template>

<script>
import api from '@/api/safetySupervision/base/inspectionTemplate.js'
const columns = [
  {
    title: '考核项',
    dataIndex: 'checkType',
    ellipsis: true
  },
  {
    title: '扣分标准',
    dataIndex: 'deductPoints',
    ellipsis: true
  },
  {
    title: '选择说明',
    dataIndex: 'content',
    ellipsis: true
  }
]
export default {
  name: 'a' + Date.now(),
  props: {
    visible: {
      type: Boolean,
      default: true
    },
    checkList: {
      type: Array,
      default: []
    }
  },
  computed: {
    rowSelection() {
      return {
        selectedRowKeys: this.selectedRowKeys,
        selectedRows: this.selectedRows, // 当前行所有数据
        onChange: this.onSelectChange,
        getCheckboxProps: (record) => ({
          props: {
            disabled: record.disabled // Column configuration not to be checked
          }
        })
      }
    }
  },
  data() {
    this.columns = columns

    return {
      loading: false,
      selectedRowKeys: [],
      list: [],
      loadData: () => {
        return new Promise((resolve, reject) => {
          console.log( this.checkList,22222)
          api.listPersonDetailModal({}).then((res) => {
            console.log(res,11111111)
            res.data.forEach((f) => {
              //过滤不可用
                f.disabled=false
              // if (f.status == 1) {
              //   res.data.splice(i, 1)
              // }
              //过滤已选
              this.checkList.forEach((e) => {
                if (f.checkTypeCode && e.checkTypeCode && (f.checkTypeCode === e.checkTypeCode)) {
                  f.disabled = true
                }
              })
            })
            this.list = res.data
            resolve({
              data: res.data.filter((item)=>!item.disabled)
            })
          })
        })
      }
    }
  },

  watch: {
    visible(e) {
      if (e) {
        this.$nextTick(() => {
          this.$refs?.tableModalList.refresh(true)
        })
      }
    }
  },
  methods: {
    onSelectChange(selectedRowKeys) {
      console.log('selectedRowKeys changed: ', selectedRowKeys)
      this.selectedRowKeys = selectedRowKeys
    },
    async ok() {
      console.log(this.selectedRowKeys)
      let params = []
      this.selectedRowKeys.forEach((i) => {
        params.push(this.list.filter((e) => e.id == i)[0])
      })

      this.$noticeSuccess('保存成功')
      this.$emit('ok', params)
      this.cancel()
    },
    cancel() {
      this.$emit('update:visible', false)
    }
  }
}
</script>

<style lang="less" scoped>
.operation-conference-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  .ant-select {
    flex: 1;
  }
  .ant-checkbox-wrapper {
    margin-left: 10px;
  }
}
</style>
